    <script type="text/javascript">
       	$(document).ready(function(){
       		loaditemviewcontainer(null,  CURRENTITEMVIEWCONTAINER);
       	});
      </script>
   	<div style="display:none">
   		<form id="customizedForm" action="" method="post">
   			<input type="hidden" name="action" value="savecustomized"/>
   		<?php forEach($ITEMSECTIONLIST as $itemsection){?>
   			<input type="hidden" name="item_section_color_<?=$itemsection['id']?>"/>
   		<?php } ?>
   		</form>
   	</div>
   
   
   	 <div class="row-fluid" id="stage">
      	  	<div class="span12">
      	  		<ul>
      	  			<li class="barEndLeft"></li>
      	  			<?php
					$ctr = 0;
					$activecss = "class='active'";
      	  			foreach ($ITEMSECTIONLIST as $itemview){?>
      	  				<li><a href="javascript:void(0);" onclick="loadview(this , <?=$ctr ?> , '<?=$itemview['item_view_id']?>')" <?=$activecss?> id="steps_<?=$ctr ?>"></a></li>
      	  			<?php 
	      	  			if($ctr == 0){
	      	  				$activecss = "";
	      	  			}
	      	  			if($ctr == 13)
	      	  				break;
	      	  			$ctr++;
      	  			}
      	  			?>
      	  			<li class="barEndRight"></li>
      	  		</ul>
      	  	</div>
      	  </div>
      	  
      	  <div class="row-fluid">
      	  
      	  	<div class="span7" style="text-align: center;">
      	  	 
      	  	
      	  	<?php
      	  	 $counter = 0 ;
      	  	 $coordinatescounter = 0;
      	  	 $displaydiv = "";
      	  	 foreach($ITEMVIEW as $view){
      	  	 if($view['id'] != $FIRSTVIEWID)
      	  	 	$displaydiv = "style='display:none'";
      	  	// if($counter == 0){
      	  	?>
      	  		<div id="div_image_view_<?=$view['id']?>" <?=$displaydiv?>>
      	  		<svg style="z-index:-1; position:absolute; width:100%; height:100%" version="1.1" xmlns="http://www.w3.org/2000/svg" id="svg_<?=$view['id']?>">

				</svg>
				<img src="<?=$view['image_path']?>" alt="<?=$view['name']?>" width="440" height="566" border="0" usemap="#Map_<?=$view['id']?>" style="margin-bottom: 24px;">
      	  		
      	  		<!--ITEM VIEW COORDINATES -->
      	  		<map name="Map_<?=$view['id']?>">
                   <area shape="poly" coords="278,105" href="#">
		             <?php 
			   		
			   		    $itemViewSectionCoordinatesVar = "ITEMVIEWCOORDINATES_".$view['id'];
	   					$itemViewSectionCoordinatesList = (isset($$itemViewSectionCoordinatesVar))? $$itemViewSectionCoordinatesVar : array();
	   					
	   					
	   					foreach ($itemViewSectionCoordinatesList as $viewCoordinates){
	   						//echo "(((((((((((--------".$viewCoordinates['coordinates'].")))))))))))))<br>";
	      	  	        ?>
		                <area class="imagemap section_class_<?=$viewCoordinates['item_section_id']?>" title="<?=$viewCoordinates['item_section_id']?>" shape="poly" alt="<?=$view['id']?>" id="<?=$viewCoordinates['id']?>" coords="<?=$viewCoordinates['coordinates']?>" href="javascript:void(0);">
		                
		                <?php 
		                }
	   					?>
	             
	            </map>
      	  		</div>
      	  		
      	    <?php
      	  	// }
      	    $counter++;
      	  	 }
      	  	 ?>
      	  		<ul id="views">
      	  	<?php 
      	  	 $counter = 0 ;
      	  	 foreach($ITEMVIEW as $view){
      	  	 		if($counter < 4){
      	  	 ?>
      	  			<li  onclick="loaditemviewcontainer(this , <?=$view['id'] ?> )"><img src="<?=$view['image_path']?>" alt="view1" width="44" height="57"></li>
      	  	<?php
      	  	 		}
      	  		$counter++; 
      	  	 } 
      	  	 ?>
      	  		</ul>
      	  	</div>
      	  	<div class="span5">
      	  		<div class="toolWindow" id="">
      	  		
      	  		
      	  		<?php 
      	  		$counter = 0 ;
      	  	    $displaydiv = "";
      	  	    
      	  		for($i=0; $i<count($ITEMSECTIONLIST);$i++){
      	  			$view = $ITEMSECTIONLIST[$counter];
      	  		if($counter >= 1)
      	  	 		$displaydiv = "style='display:none'";?>
      	  		<div class="toolWindow" id="div_item_section_color_container_<?=$counter?>" <?=$displaydiv?>>
      	  		<h2>
      	  			<?php if($counter > 0 ):?>
      	  			<a href="javascript:void(0)" onclick="loadview(this, <?=$counter - 1 ?> , '<?=$ITEMSECTIONLIST[$counter - 1]['item_view_id']?>')" class="pull-left"><img src="/coreassets/company/hawk/images/nav-left.png" alt="nav-left" width="56" height="45"></a>
      	  		 	<?php endif;?>
      	  		 		<?=strtoupper($view['name'])?>
      	  		 	<?php if($counter < ($totalcount -1) ):?>
      	  	    	<a href="javascript:void(0)" onclick="loadview(this, <?=$counter + 1?> , '<?=$ITEMSECTIONLIST[$counter + 1]['item_view_id']?>')" class="pull-right"><img src="/coreassets/company/hawk/images/nav-right.png" alt="nav-right" width="55" height="45"></a>
      	  	    	<?php endif;?>
      	  	    </h2>
      	  		<?php 
      	  		  $varSectionColors = "ITEMCOLORSFORSPECIFICSECTION_".$view['id'];
      	  		  	$currentColorInSectionCounter = 0;
      	  	        $itemColorsForSpecificSection = $$varSectionColors;
      	  	        echo '<ul class="swatches">';
      	  	        foreach ($itemColorsForSpecificSection as $colorInSection){
      	  	        	?>	
      	  	        	
      	  	        		 <li class="click" style="background:<?=$colorInSection['value']?>" onclick="setSelectedColor(<?=$view['id']?> , <?=$colorInSection['id']?> , <?= $currentColorInSectionCounter ?> , <?=$currentColorInSectionCounter?>, '<?=$colorInSection['value']?>')">
					      	  		<img id="active_section_color_<?=$view['id']."_".$colorInSection['id']."_"?>" style="display:none" src="/coreassets/company/hawk/images/bullet-active.png" alt="bullet-active" width="33" height="33" class="indicator">
					      	 </li>
      	  	        	
      	  	        	<?php 
      	  	        	$currentColorInSectionCounter++;
      	  	        }
      	  			echo '	</ul>';
					?>
      	  			
      	  		</div>
      	  		<?php $counter++;?>
      	  		<?php } 
      	  	    
      	  	    ?>
      	  		</div>
      	  		<div class="toolWindow">
      	  			<h2 style='text-align: right'>&nbsp;
      	  			<a href="javascript:void(0)" onclick="submitForm('customizedForm')" class="pull-right">CONTINUE &nbsp;&nbsp;<img src="/coreassets/company/hawk/images/nav-right.png" alt="nav-right" width="55" height="45"></a>
      	  			</h2>
      	  			
      	  			<!--
      	  			<p class="pull-left" style="margin-right: 38px;"><span>SAVE PHOTO</span><img src="/coreassets/company/hawk/images/icon-camera.png" alt="icon-camera" width="38" height="31"></p>
      	  			<p class="pull-left"><span>SHARE</span><img src="/coreassets/company/hawk/images/icon-twitter.png" alt="icon-twitter" width="30" height="30"><img src="/coreassets/company/hawk/images/icon-fb.png" alt="icon-fb" width="30" height="30"><img src="/coreassets/company/hawk/images/icon-mail.png" alt="icon-mail" width="48" height="30"></p>
      	  			-->
      	  			<div class="clearfix"></div>
      	  		</div>
      	  	</div>
      	  	
      	  </div>
      	 
      	  
